<template>
    <div class="app-container">
        <el-row>
            <el-col :span="7">
                <div class="pat-info">
                    <div>
                        <el-radio-group v-model="patInfo">
                            <el-radio-button :label="true">患者信息</el-radio-button>
                            <el-radio-button :label="false">360</el-radio-button>
                        </el-radio-group>
                    </div>
                    <div class="padding-10">
                        <div class="pat-name"><i class="el-icon-user-solid"
                                style="color: #1D77FF;margin-right: 10px;"></i>{{ patient.patName }}</div>
                        <div class="patient-row">
                            <div class="label">问诊类型 </div>
                            <div class="value">{{ cusultInfo.consultationTypeName }}</div>
                        </div>
                        <div class="patient-row">
                            <div class="label">时间 </div>
                            <div class="value">{{ cusultInfo.createTime }}</div>
                        </div>
                        <el-divider content-position="center">基本信息</el-divider>
                        <div class="patient-row">
                            <div class="label">性别 </div>
                            <div class="value">{{ patient.patSex == "1" ? '男' : '女' }}</div>
                        </div>
                        <div class="patient-row">
                            <div class="label">年龄</div>
                            <div class="value">{{ patient.patAge }}</div>
                        </div>
                        <div class="patient-row">
                            <div class="label">电话 </div>
                            <div class="value">{{ patient.patPhone }}</div>
                        </div>
                        <div class="patient-row">
                            <div class="label">生日</div>
                            <div class="value">{{ patient.patBirthDate }}</div>
                        </div>
                        <div class="patient-row">
                            <div class="label">身份证</div>
                            <div class="value">{{ patient.certId }}</div>
                        </div>
                        <div class="patient-row">
                            <div class="label">地址 </div>
                            <div class="value">{{ patient.province }}{{ patient.city }}{{ patient.district }}</div>
                        </div>
                        <el-divider content-position="center">病情描述</el-divider>
                        <div style="text-align: justify;color:#333;padding:10px">
                            {{ cusultInfo.diseaseDescription }}
                        </div>
                    </div>

                </div>
            </el-col>
            <el-col :span="17">
                <div class="card-main">
                    <div>
                        <el-radio-group v-model="showPage">
                            <el-radio-button :label="1">门诊病历</el-radio-button>
                            <el-radio-button :label="2">在线诊断</el-radio-button>
                            <el-radio-button :label="3">医嘱开单</el-radio-button>
                            <el-radio-button :label="4">检验检查开单</el-radio-button>
                        </el-radio-group>
                    </div>

                    <div v-if="showPage == '1'" style="height: inherit;">
                        <div style="padding: 20px;">
                            <el-button type="primary" @click="saveRecord">保存</el-button>
                            <el-button type="primary" @click="handleSubmit">提交</el-button>
                            <el-button type="primary" @click="handleRecordReset">清空</el-button>
                        </div>
                        <div style="height:800px;overflow-y: auto;padding-bottom:100px ;">
                            <el-form :model="recordForm" :rules="rules" ref="recordForm" label-width="160px"
                                size="small">
                                <el-form-item label="主诉" prop="chiefComplaint" class="record-item">
                                    <el-input v-model="recordForm.chiefComplaint" type="textarea" :rows="2"
                                        placeholder="请输入标签描述" maxlength="200" show-word-limit style="width: 70%;" />
                                </el-form-item>
                                <el-form-item label="现病史" prop="currentDiseaseHistory" class="record-item">
                                    <el-input v-model="recordForm.currentDiseaseHistory" type="textarea" :rows="2"
                                        placeholder="请输入标签描述" maxlength="200" show-word-limit style="width: 70%" />
                                </el-form-item>
                                <el-form-item label="既往史" prop="pastDiseaseHistory" class="record-item">
                                    <el-input v-model="recordForm.pastDiseaseHistory" type="textarea" :rows="2"
                                        placeholder="请输入标签描述" maxlength="200" show-word-limit style="width: 70%;" />
                                </el-form-item>
                                <el-form-item label="过敏史" prop="allergy" class="record-item">
                                    <el-input v-model="recordForm.allergy" type="textarea" :rows="2"
                                        placeholder="请输入标签描述" maxlength="200" show-word-limit style="width: 70%;" />
                                </el-form-item>
                                <el-form-item label="体格检查" prop="sign" class="record-item">
                                    <el-input v-model="recordForm.sign" type="textarea" :rows="2" placeholder="请输入标签描述"
                                        maxlength="200" show-word-limit style="width: 70%;" />
                                </el-form-item>

                                <el-form-item label="辅助检查结果" prop="exam" class="record-item">
                                    <el-input v-model="recordForm.exam" type="textarea" :rows="2" placeholder="请输入标签描述"
                                        maxlength="200" show-word-limit style="width: 70%;" />
                                </el-form-item>

                                <el-form-item label="初步诊断" prop="primaryDiag" class="record-item">
                                    <el-input v-model="recordForm.primaryDiag" type="textarea" :rows="2"
                                        placeholder="请输入标签描述" maxlength="200" show-word-limit style="width: 70%;" />
                                </el-form-item>

                                <el-form-item label="处理意见" prop="opinion" class="record-item">
                                    <el-input v-model="recordForm.opinion" type="textarea" :rows="2"
                                        placeholder="请输入标签描述" maxlength="200" show-word-limit style="width: 70%;" />
                                </el-form-item>

                                <el-form-item label="治则治法（中医）" prop="cn1" class="record-item">
                                    <el-input v-model="recordForm.allergy" type="textarea" :rows="2"
                                        placeholder="请输入标签描述" maxlength="200" show-word-limit style="width: 70%;" />
                                </el-form-item>

                                <el-form-item label="四诊观察结果（中医）" prop="cn2" class="record-item">
                                    <el-input v-model="recordForm.allergy" type="textarea" :rows="2"
                                        placeholder="请输入标签描述" maxlength="200" show-word-limit style="width: 70%;" />
                                </el-form-item>

                                <el-form-item label="辩证依据（中医）" prop="cn3" class="record-item">
                                    <el-input v-model="recordForm.allergy" type="textarea" :rows="2"
                                        placeholder="请输入标签描述" maxlength="200" show-word-limit style="width: 70%;" />
                                </el-form-item>
                            </el-form>
                        </div>

                    </div>
                    <div v-if="showPage == '2'">
                        <div class="order-box">
                            <div style="padding: 20px;">
                                <el-button type="primary" @click="addOneDiag">添加</el-button>
                                <el-button type="primary" @click="deleteOrder">删除</el-button>
                                <el-button type="primary" @click="saveDiag">保存</el-button>
                                <el-button type="primary" @click="saveAsTemp">保存为模版</el-button>
                                <el-button type="primary" @click="saveAsCommon">保存为常用用法</el-button>
                            </div>
                            <div style="padding: 0 20px;">
                                <el-form ref="formAuto" :disabled="false">
                                    <el-table ref="table" :data="diagData" border style="width: 100%" max-height="250">
                                        <el-table-column type="selection" :width="40" />
                                        <el-table-column type="index" :label="'序号'" :width="40" />

                                        <el-table-column v-for="(item, index) in diagLabel" :key="index"
                                            :prop="item.prop" :width="item.width" :label="item.label" align="center">
                                            <template v-slot="scope">
                                                <el-form-item :prop="`diagData[` + scope.$index + `].` + [item.prop]"
                                                    label-width="0">

                                                    <span v-if="item.type === 'name'">{{ scope.row[item.prop] }}</span>

                                                    <el-input v-if="item.type === 'string'"
                                                        v-model="scope.row[item.prop]" />

                                                    <el-select v-if="item.type === 'array'"
                                                        v-model="scope.row[item.prop]" style="width: 100%;" filterable
                                                        clearable :multiple="item.multiple" collapse-tags>
                                                        <el-option v-for="item in item.option" :key="item.encode"
                                                            :label="item.name" :value="item.encode" />
                                                    </el-select>
                                                </el-form-item>
                                            </template>
                                        </el-table-column>
                                        <el-table-column label="操作" width="100">
                                            <template v-slot="scope">
                                                <el-link type="primary">上移</el-link>
                                                <el-link type="primary">下移</el-link>
                                                <el-link type="primary">删除</el-link>
                                            </template>
                                        </el-table-column>


                                    </el-table>

                                </el-form>
                            </div>
                        </div>

                        <div class="bottom-box">
                            <div class="top-nav">
                                <el-radio-group v-model="diagType">
                                    <el-radio-button :label="1">历史诊断</el-radio-button>
                                    <el-radio-button :label="2">诊断模版</el-radio-button>
                                </el-radio-group>


                            </div>
                            <div class="history-order" v-if="diagType == '1'">
                                <div class="margin-10">
                                    <el-radio-group v-model="deptDiag">
                                        <el-radio-button :label="1">全部</el-radio-button>
                                        <el-radio-button :label="2">本科</el-radio-button>
                                        <el-radio-button :label="3">其他科</el-radio-button>
                                    </el-radio-group>
                                </div>
                                <div>
                                    <div v-for="dept in historyOrderDeptAry">
                                        <div class="temp-title">{{ dept.dept }} <span style="font-size: 13px;">{{
                                            dept.date.substring(0, 10)
                                                }}</span></div>
                                        <div class="temp-item" v-for="item in historyOrder[dept.dept]">[{{ item.typeName
                                            }}] {{ item.name }}
                                            [{{ item.dosage }}{{ item.dosageUnit }} {{ item.supplyName }} {{
                                                item.frequency
                                            }} {{ item.day }}]
                                            {{ item.remark }}</div>
                                    </div>
                                </div>

                            </div>
                            <div class="order-temp" v-if="diagType == '2'">
                                <div class="margin-10">
                                    <el-radio-group v-model="deptTemp">
                                        <el-radio-button :label="1">个人</el-radio-button>
                                        <el-radio-button :label="2">科室</el-radio-button>
                                    </el-radio-group>

                                    <el-radio-group v-model="diagCate">
                                        <el-radio-button :label="1">西医</el-radio-button>
                                        <el-radio-button :label="2">中医</el-radio-button>
                                    </el-radio-group>

                                    <el-button type="primary" class="pull-right"
                                        @click="editTemp('diag')">编辑模版</el-button>
                                </div>
                                <div style="padding: 20px; margin: 20px;">
                                    <el-table ref="table" :data="diagData" border max-height="250">
                                        <el-table-column type="index" prop="index" :label="'序号'" :width="60" />
                                        <el-table-column type="index" prop="typeName" :label="'类型'" :width="100" />
                                        <el-table-column type="index" prop="diag" :label="'ICD诊断'" :width="140" />
                                        <el-table-column type="index" prop="remark" :label="'备注'" :width="140" />
                                    </el-table>

                                </div>

                            </div>

                        </div>


                    </div>
                    <!-- 医嘱开单 -->
                    <div v-if="showPage == '3'">
                        <div class="order-box">
                            <div style="padding: 20px;">
                                <el-button type="primary" @click="addOneOrder">添加</el-button>
                                <el-button type="primary">删除</el-button>
                                <el-button type="primary" @click="saveOrder">保存</el-button>
                                <el-button type="primary">保存为模版</el-button>
                            </div>
                            <div style="padding: 0 20px;">
                                <el-form ref="formAuto" :disabled="false">
                                    <el-table ref="table" :data="tableData" border style="width: 100%" max-height="650">
                                        <el-table-column type="selection" :width="40" />
                                        <el-table-column type="index" :label="'序号'" :width="40" />

                                        <el-table-column v-for="(item, index) in tableLabel" :key="index"
                                            :prop="item.prop" :width="item.width" :label="item.label" align="center">
                                            <template v-slot="scope">
                                                <el-form-item :prop="`tableData[` + scope.$index + `].` + [item.prop]"
                                                    label-width="0" v-if="scope.row['status'] === 0">
                                                    <el-autocomplete v-if="item.type === 'name'"
                                                        v-model="scope.row[item.prop]"
                                                        style="width: 200px; margin: 20px;" suffix-icon="el-icon-search"
                                                        :fetch-suggestions="querySearchAsync" placeholder="请输入药品名称"
                                                        @select="getdrug" @focus="getidx(scope.$index)">
                                                        <template slot-scope="{item}">
                                                            <div class="name" style="width: 400px;">{{ item.name }}【{{
                                                                item.code }}】</div>
                                                        </template>
                                                    </el-autocomplete>
                                                    <el-input v-if="item.type === 'string'"
                                                        v-model="scope.row[item.prop]" />
                                                    <el-date-picker v-if="item.type === 'number'"
                                                        v-model="scope.row[item.prop]" style="width: 100%;" type="date"
                                                        format="yyyy-MM-dd" value-format="yyyy-MM-dd" />
                                                    <el-select v-if="item.type === 'frequency'"
                                                        v-model="scope.row[item.prop]" style="width: 100%;" filterable
                                                        clearable :multiple="item.multiple" collapse-tags>
                                                        <el-option v-for="item in frequencyList" :key="item"
                                                            :label="item" :value="item" />
                                                    </el-select>
                                                    <el-select v-if="item.type === 'routeList'"
                                                        v-model="scope.row[item.prop]" style="width: 100%;" filterable
                                                        clearable :multiple="item.multiple" collapse-tags>
                                                        <el-option v-for="item in routeList" :key="item" :label="item"
                                                            :value="item" />
                                                    </el-select>
                                                    <el-select v-if="item.type === 'doseUnitList'"
                                                        v-model="scope.row[item.prop]" style="width: 100%;" filterable
                                                        clearable :multiple="item.multiple" collapse-tags>
                                                        <el-option v-for="item in doseUnitList" :key="item"
                                                            :label="item" :value="item" />
                                                    </el-select>
                                                    <span v-if="item.type === 'price'">{{ scope.row[item.prop] }}</span>
                                                    <span v-if="item.type === 'amount'">
                                                        <el-input style="width: 50px;" v-model="scope.row[item.prop]" />
                                                        {{ scope.row['unit'] }}</span>
                                                </el-form-item>
                                                <el-form-item :prop="`tableData[` + scope.$index + `].` + [item.prop]"
                                                    label-width="0" v-else>
                                                    <span v-if="item.prop != 'name'">{{ scope.row[item.prop] }}</span>
                                                    <span v-if="item.prop === 'name'">
                                                        {{ scope.row[item.prop] }}
                                                        <el-tag size="mini" type="danger"
                                                            v-if="scope.row['status'] === '已作废'"> {{
                                                                scope.row['status']
                                                            }}</el-tag>
                                                        <el-tag size="mini" type="success"
                                                            v-if="scope.row['status'] === '已执行'"> {{
                                                                scope.row['status'] }}</el-tag>
                                                        <el-tag size="mini" type="info"
                                                            v-if="scope.row['status'] === '已缴费'">
                                                            {{ scope.row['status']
                                                            }}</el-tag>
                                                    </span>
                                                </el-form-item>
                                            </template>
                                        </el-table-column>
                                        <el-table-column label="操作" width="60">
                                            <template v-slot="scope">
                                                <el-link type="danger" v-if="scope.row['status'] === 0"
                                                    @click.native.prevent="deleteRow(scope.$index, tableData)">删除</el-link>
                                                <el-link type="danger" v-if="scope.row['status'] != 0"
                                                    @click.native.prevent="setOrderState(scope.$index, 1)">撤销</el-link>
                                                <el-link type="danger" v-if="scope.row['status'] != 0"
                                                    @click.native.prevent="setOrderState(scope.$index, -1)">作废</el-link>

                                            </template>
                                        </el-table-column>


                                    </el-table>

                                </el-form>
                            </div>
                        </div>
                        <div class="bottom-box">
                            <div class="top-nav">
                                <el-radio-group v-model="navType">
                                    <el-radio-button :label="1">历史医嘱</el-radio-button>
                                    <el-radio-button :label="2">医嘱模版</el-radio-button>
                                </el-radio-group>


                            </div>
                            <div class="history-order" v-if="navType == '1'">
                                <div class="margin-10">
                                    <el-radio-group v-model="deptOrder">
                                        <el-radio-button :label="1">全部</el-radio-button>
                                        <el-radio-button :label="2">本科</el-radio-button>
                                        <el-radio-button :label="3">其他科</el-radio-button>
                                    </el-radio-group>
                                </div>
                                <div>
                                    <div v-for="dept in historyOrderDeptAry">
                                        <div class="temp-title">{{ dept.dept }} <span style="font-size: 13px;">{{
                                            dept.date.substring(0, 10)
                                                }}</span></div>
                                        <div class="temp-item" v-for="item in historyOrder[dept.dept]">[{{ item.typeName
                                            }}] {{ item.name }}
                                            [{{ item.dosage }}{{ item.dosageUnit }} {{ item.supplyName }} {{
                                                item.frequency
                                            }} {{ item.day }}]
                                            {{ item.remark }}</div>
                                    </div>
                                </div>

                            </div>
                            <div class="order-temp" v-if="navType == '2'">
                                <div class="margin-10">
                                    <el-radio-group v-model="deptTemp">
                                        <el-radio-button :label="1">个人</el-radio-button>
                                        <el-radio-button :label="2">科室</el-radio-button>
                                        <el-radio-button :label="3">全院</el-radio-button>
                                        <el-radio-button :label="4">知识库</el-radio-button>
                                    </el-radio-group>

                                    <el-button type="primary" class="pull-right"
                                        @click="editTemp('order')">编辑模版</el-button>
                                </div>
                                <div style="display: flex;">

                                    <div class="temp-box" v-for="(item, index) in cateAry" :key="index">
                                        <div class="temp-title ">{{ item }}</div>

                                        <div class="temp-text">
                                            <p v-for="(it, index) in tempData[item]" :key="it.id" class="temp-item"
                                                :class="{ selected: it.id === selectedIndex }"
                                                @click="handleCurrentChange(it)">{{
                                                    it.describe }} <span v-if="it.spec">[ {{ it.spec }}
                                                    ]</span> </p>
                                        </div>
                                    </div>
                                </div>

                            </div>

                        </div>
                    </div>
                    <div v-if="showPage == '4'">

                    </div>
                </div>
            </el-col>
            <el-col :span="6">
                <div class="card-message d-none">
                    <el-radio-group v-model="consultType">
                        <el-radio-button :label="1">图文问诊</el-radio-button>
                        <el-radio-button :label="2">语音通话</el-radio-button>
                        <el-radio-button :label="3">视频通话</el-radio-button>
                    </el-radio-group>
                    <div style="width: inherit;">

                        <div class="talk" style="width: inherit;">

                            <el-divider content-position="center">问诊已开始，本次问诊可持续24小时</el-divider>
                            <div class="tab-pane">

                                <ul class="unstyled">
                                    <li :class="im.isDoc ? 'other' : 'mine'" v-for="im in messageRecord">
                                        <div class="time">{{ im.time }}</div>
                                        <p>{{ im.content }}</p>
                                    </li>
                                </ul>
                            </div>
                            <div class="editorParentDiv" style="width: inherit;">
                                <input type="file" class="d-none" id="callmsgimg" name="cover" accept="image/*"
                                    @change="onImgChange">
                                <el-button type="text" size="mini" @click="uploadImage()">发送图片</el-button>


                                <div class="pull-right mb-10">
                                    <el-button type="primary" icon="el-icon-position" size="mini"
                                        @click="sendpatmsg()">发送</el-button>
                                </div>

                                <div class="editor" id="message" contenteditable="true"></div>
                            </div>
                        </div>

                    </div>
                </div>
            </el-col>
        </el-row>
    </div>
</template>

<script>
import { patInfoSelect, patConsultSelect, orderSave, orderSelect, orderTempSelect } from '@/api/doctor/patient'
export default {
    name: "Patient",
    data() {
        return {
            patient: {},
            cusultInfo: {},
            patInfo: true,
            consultType: "2",
            showPage: "1",
            deptTemp: "1",
            deptOrder: "1",
            navType: "1",
            diagType: "1",
            deptDiag: "1",
            diagCate: "1",
            orderTableIndex: "",
            currentdrug: "",
            cateAry: [],
            doctor: { code: "854", name: 'lili', dept: '209' },
            tableData: [],
            diagData: [],
            drugFrom: {
                name: "",
                dose: "",
                doseUnit: "",
                freq: "",
                route: "",
                day: "",
                amount: '',
                remark: ""
            },

            tableLabel: [
                { label: '医嘱名称', width: '', prop: 'name', type: 'name' },
                { label: '单次剂量', width: '80', prop: 'dosage', type: 'string' },
                { label: '单位', width: '80', prop: 'dosageUnit', type: 'doseUnitList' },
                { label: '用法', width: '120', prop: 'supplyName', type: 'routeList' },
                { label: '频次', width: '120', prop: 'frequency', type: 'frequency' },
                { label: '疗程', width: '60', prop: 'day', type: 'string' },
                { label: '数量', width: '90', prop: 'amount', type: 'amount' },
                { label: '价格', width: '60', prop: 'price', type: 'price' }

            ],
            diagLabel: [
                { label: '分类', width: '100', prop: 'category', type: 'array', option: [{ encode: 'CN', name: '中医' }, { encode: 'EN', name: '西医' }] },
                { label: '诊断类型', width: '120', prop: 'diagType', type: 'array', option: [{ encode: 'outp', name: '门诊诊断' }, { encode: 'inp', name: '入院诊断' }] },
                { label: '级别', width: '90', prop: 'level', type: 'array', option: [{ encode: '1', name: '1' }, { encode: '2', name: '2' }, { encode: '3', name: '3' }] },
                { label: '诊断', width: '', prop: 'name', type: 'string' },
                { label: '诊断备注', width: '120', prop: 'remark', type: 'string' },
                { label: 'ICD', width: '60', prop: 'ICD', type: 'ICD' },
                { label: '中医证明', width: '100', prop: 'prove', type: 'array', option: [{ encode: '1', name: '1' }, { encode: '2', name: '2' }, { encode: '3', name: '3' }] },
                { label: '主诊断', width: '60', prop: 'mainDiag', type: 'check' },
            ],
            drugList: [
                {
                    name: '阿莫西林分散片', code: 'Y213120000', price: '1.9', unit: "盒"
                },
                {
                    name: '头孢克肟咀嚼片', code: 'Y213120001', price: '3.7', unit: "盒"
                }
            ],

            // 标签表单
            recordForm: {
                id: null,
                time: '',
                chiefComplaint: '',
                pastDiseaseHistory: '',
                currentDiseaseHistory: '',
                allergy: '',
                diagnosis: ''
            },  // 表单验证规则
            drug: [{
                name: "",
                dose: "",
                doseUnit: "",
                freq: "",
                route: "",
                day: "",
                amount: '',
                remark: ""
            }, {
                name: "",
                dose: "",
                doseUnit: "",
                freq: "",
                route: "",
                day: "",
                amount: '',
                remark: ""
            }],
            selectedIndex: -1,
            historyOrder: [],
            historyOrderDeptAry: [],
            rules: {
                time: [
                    { required: true, message: '请选择时间', trigger: 'blur' }
                ],
                chiefComplaint: [
                    { required: true, message: '请输入患者主诉', trigger: 'blur' },
                    { min: 5, max: 200, message: '长度在 5 到 200 个字符', trigger: 'blur' }
                ],
                pastDiseaseHistory: [
                    { required: true, message: '请输入患者既往史', trigger: 'blur' }

                ],
                currentDiseaseHistory: [
                    { required: true, message: '请输入患者现病史', trigger: 'blur' }
                ],

            },
            showRecord: false,
            messageRecord: [
                {
                    isDoc: false,
                    time: '13:35:13',
                    content: "呈间歇性钝痛，餐后加重，伴反酸、嗳气，无放射痛。自呈间歇性钝痛，餐后加重，伴反酸、嗳气，无放射痛。"
                },
                {
                    isDoc: false,
                    time: '13:35:13',
                    content: "1234"
                },
                {
                    isDoc: true,
                    time: '13:35:13',
                    content: "饮食怎么样"
                },
                {
                    isDoc: true,
                    time: '13:35:13',
                    content: "呈间歇性钝痛，餐后加重，伴反酸、嗳气，无放射痛。自呈间歇性钝痛，餐后加重，伴反酸、嗳气，无放射痛。"
                },
            ],
            routeList: ["口服", "皮下注射", "静脉注射", "肌肉注射"],
            frequencyList: ["一天一次", "一天两次", "一天三次"],
            doseUnitList: ["g", "mg", "ml", "片"],
            statusTag: ["已执行", "已作废", "已缴费"]
        };
    },
    mounted() { this.loadData() },
    methods: {
        loadData() {
            patInfoSelect({ patId: '16146316' }).then(res => {
                this.patient = res[0]
            })
            patConsultSelect({ patId: '16146316' }).then(res => {
                this.cusultInfo = res[0]
            })
            var historyOrder = []
            orderSelect({ patId: '16146316' }).then(res => {
                res.forEach(item => {
                    item.amount = item.amount + " " + item.unit
                    item.name = item.name
                    item.day = item.day + "天"
                    item.price = item.price / 100
                    item.status = this.statusTag[item.status]
                })
                historyOrder = res
                const groupedByDept = historyOrder.reduce((group, item) => {
                    const { departmentName } = item;
                    group[departmentName] = group[departmentName] || [];
                    group[departmentName].push(item);
                    return group;
                }, {});
                let historyOrderDeptAry = []

                Array.from(new Set(res.map(item => item.departmentName))).forEach(it => {
                    let temp = groupedByDept[it][0].startTime
                    let obj = {
                        dept: it,
                        date: temp
                    }
                    historyOrderDeptAry.push(obj)
                })
                this.historyOrderDeptAry = historyOrderDeptAry
                this.historyOrder = groupedByDept
                this.tableData = res
            })
            //医嘱模版查询
            orderTempSelect({ creator: "8699" }).then(res => {
                if (res) {
                    let ary = []
                    const groupedAndSortedItems = res.reduce((acc, item) => {
                        if (!acc[item.name]) {
                            acc[item.name] = [];
                        }
                        ary.push(item.name)
                        acc[item.name].push(item);
                        return acc;
                    }, {});

                    Object.values(groupedAndSortedItems).forEach(group => {
                        group.sort((a, b) => a.sort - b.sort);
                    });
                    this.tempData = groupedAndSortedItems
                    this.cateAry = Array.from(new Set(ary));
                }
            })
        },
        saveRecord() {

        },
        //病历内容
        handleRecordReset() { },
        //模糊查询后台数据
        querySearchAsync(queryString, cb) {
            var drugList = this.drugList;
            var results = drugList;
            cb(results)
        },

        addOneDiag() {
            const obj = {}
            for (let i = 0; i < this.diagLabel.length; i++) {
                const item1 = this.diagLabel[i].prop
                obj[item1] = undefined
            }
            this.diagData.push(obj)
        },

        addOneOrder() {
            const obj = {}
            for (let i = 0; i < this.tableLabel.length; i++) {
                const item1 = this.tableLabel[i].prop
                obj[item1] = undefined
                obj["status"] = 0
            }
            this.tableData.push(obj)
        },

        //保存医嘱
        saveOrder() {
            this.tableData.forEach(item => {
                item.patId = this.patient.patId
                item.doctorCode = this.doctor.code
                item.doctorName = this.doctor.name
                item.department = this.doctor.dept
                item.price = item.price * 100
            })
            const list = this.tableData.filter(item => item.status === 0)
            orderSave({ list: list }).then(res => {
                if (res === 1) {
                    this.$message.success('保存成功！')
                    this.loadData()
                }
            })

        },
        //获取选中的药品
        getdrug(item) {
            this.tableData[this.orderTableIndex].name = item.name
            this.tableData[this.orderTableIndex].code = item.code
            this.tableData[this.orderTableIndex].price = item.price
            this.tableData[this.orderTableIndex].unit = item.unit

        },
        getidx(index) {
            this.orderTableIndex = index
        },
        handleCurrentChange(it) {
            this.addOneOrder()
            this.tableData[this.tableData.length - 1].name = it.describe

        },
        deleteOrder(index, tableData) { // eslint-disable-line no-unused-vars
            tableData = tableData.splice(index, 1)
        },
        setOrderState(index, state) {
            var tip = "是否撤销该条医嘱?"
            if (state === -1) tip = "是否作废该条医嘱?"
            this.$alert(tip, '', {
                confirmButtonText: '确定',
                callback: action => {
                    this.$message({
                        type: 'info',
                        message: `action: ${action}`
                    });
                }
            });
        },
        editTemp(type) {
            if (type === "order") this.$router.push({ path: 'orderTemp' })
            if (type === "diag") this.$router.push({ path: 'diagTemp' })

        },
        saveAsTemp() {

        },
        //保存诊断
        saveDiag() {

        },
        saveAsCommon() {

        },
        handleSearch() {

        },



        handleSelect(key) {
            this.showRecord = false
            if (key == 1) {
                this.showRecord = true
            }

        },
        handleSubmit() {




        },
        onImgChange() {

        }
    }

};
</script>

<style lang="scss" scoped>
.app-container {
    padding: 20px;
    height: 100%;
}

.pat-info {
    border: 1px solid #d7dae2;
    height: 900px;
}

.padding-10 {
    padding: 10px;
}

.card-main {
    border: 1px solid #d7dae2;
    height: 900px;
    margin: 0 20px 0 20px;
}

.card-message {
    border: 1px solid #d7dae2;
    height: 900px;
}

.message-title {
    font-weight: 400;
    padding: 10px;
}

.patient-row {
    display: flex;
    justify-content: space-between;
    padding: 10px;
}

.record-item {
    margin: 30px;
}

.label {
    color: #666666;
    width: 7em;
}

.value {
    color: #333333;
    text-align: right;
}

.pat-name {
    padding: 10px;
    border-bottom: 1px solid #dcdfe6;
}

.order-box {
    height: 550px;
    overflow-y: auto;
    border-bottom: 1px solid #dcdfe6;
}

.top-nav {
    margin-top: -35px;
}

.unstyled {
    list-style: none;
}

.d-none {
    display: none;
}

.pull-right {
    float: right;
}

.mb-10 {
    margin-bottom: 10px;
}

.margin-10 {
    margin: 10px;
}

.selected {
    background-color: aliceblue;
}

.temp-box {
    margin: 10px;
    border: 1px solid #dcdfe6;
    border-radius: 5px;
    width: 260px;
    text-align: center;
}

.temp-text {
    padding-left: 10px;
    text-align: left;
    height: 300px;
    margin-left: 5px;
    overflow-y: auto;
}

.temp-item {
    padding: 5px 0;
    margin: 5px 0;
}

.temp-title {
    line-height: 35px;
    color: rgb(65, 144, 255);
    background: rgb(236, 244, 255);
}

.talk ul li p {
    display: inline-block;
    margin: 5px;
}

.talk ul li.mine p {
    margin-right: 20px;
    text-align: left;
    background: white;
    color: #333;
    border-radius: 0 25px 25px 25px;
    padding: 7px 15px;

}

.talk .tab-pane {
    height: 700px;
    overflow-y: auto;
    background-color: #F7F7F7;
}


.talk ul li.other p {
    margin-right: 20px;
    background: #1D77FF;
    color: white;
    text-align: left;
    border-radius: 15px 15px 0 15px;
    padding: 7px 15px;
}

.talk ul li .time {
    color: #ccc;
    text-align: center;
}

.talk {
    height: inherit;
    box-sizing: border-box;
}

.talk ul li.mine {
    text-align: left;
}

.talk ul li.other {
    text-align: right;
}

.talk .editorParentDiv {
    background-color: white;
    bottom: 10px;
    margin-left: -10px;
    padding: 10px;
    position: relative;
    top: -122px;
    width: inherit;
}

.talk .editorParentDiv .editor {
    border: 1px solid #aaa;
    box-sizing: border-box;
    padding: 5px;
    height: 122px;
    max-height: 122px;
    overflow-y: scroll;
    width: 100%;
}

::v-deep .el-form-item--mini.el-form-item,
.el-form-item--small.el-form-item {
    margin-bottom: 0;
}

.el-autocomplete {
    margin: 0px !important;
}
</style>
